<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>演示13.1练习</title>
	</head>
	<body>
		<ul>
			<li>用户名：<input type="text" id="txtUsername"></li>
			<li>密码:<input type="text" id="txtPassword" ></li>
			<li>验证码:<input type="text" name="vcode" id="txtVcode" value="" /> 
			<input type="button" id="btnGetVCode" value="获取验证码" /><span id="sVCode"></span>
			</li>
			<li><input type="button" value="登录" id="btnLogin"></li>
		</ul>
		
		<script type="text/javascript">
			// 定义用户数据列表
			var user_list = []
			
			for(var i =0; i<100; i++){
				user_list.push({"username": "user" + i, "password": "pwd" + i})
			}
			
			document.getElementById('btnLogin').onclick = function(){
				// 验证输入格式
				var uid = document.getElementById('txtUsername').value;
		
				var pwd = document.getElementById("txtPassword").value;
				if(!uid){
					alert("你就搞事情吧");
					return;
				}
				if(!pwd){
					alert("请老实的输入密码");
					return;
				}
				
				// 代表是否验证通过
				var isValid = false;
				// 验证输入的密码和用户是否正确
				for(var i=0; i<user_list.length; i++){
					console.log("uid=" + uid)
					console.log("pwd=" + pwd)
					var user = user_list[i];
					console.log(user.username)
					console.log(user.password)
					if(user.username == uid && user.password == pwd){
						isValid = true;
						break;
					}
				}
				if(!isValid){
					alert("您输入的用户名或者密码有误");
					return;
				}
				
				// 执行成功记录cookie
				setCookie('username', uid, 1);
				// 跳转到登录成功页面
				location.href = "13_1_2.html";
			}
			
			
			function setCookie(c_name,value,expiredays)
			{
				var exdate=new Date();
				exdate.setDate(exdate.getDate()+expiredays);
				document.cookie = c_name + "=" + escape(value)+
				((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
			}
		</script>
	</body>
</html>
